<template>
	<view>
  <!-- <view class="cu-bar bg-white solid-bottom margin-top">
  	<view class="action">
  	</view>
  	<view class="action">
  		<button class="cu-btn bg-green shadow" @tap="showModal" data-target="gridModal">设置</button>
  	</view>
  </view> -->
  	<view class="cuIcon-title text-orange " style="min-height: 50px;display: flex;justify-content: center;align-items: center;">工作台</view>
  <view class="cu-modal" :class="modalName=='gridModal'?'show':''" @tap="hideModal">
  	<view class="cu-dialog">
  		<radio-group class="block" @change="Gridchange">
  			<view class="cu-list menu text-left">
  				<view class="cu-item" v-for="(item,index) in 3" :key="index">
  					<label class="flex justify-between align-center flex-sub" >
  						<view class="flex-sub">{{index +3}} 列</view>
  						<radio class="round" :value="(index + 3) + ''" :class="gridCol==index+3?'checked':''" :checked="gridCol==index+3" ></radio>
  					</label>
  				</view>
  			</view>
  		</radio-group>
  		<view class="cu-list menu text-left solid-top">
  			<view class="cu-item">
  				<view class="content">
  					<text class="text-grey">边框</text>
  				</view>
  				<view class="action">
  					<switch @change="Gridswitch" :class="gridBorder?'checked':''" :checked="gridBorder?true:false"></switch>
  				</view>
  			</view>
  		</view>
  	</view>
  </view>
  <view class="cu-list grid" :class="['col-' + gridCol,gridBorder?'':'no-border']">
  	<view class="cu-item" v-for="(item,index) in cuIconList" :key="index" v-if="index<gridCol*2"  @tap.stop="toDetail(item)">
		<view :class="['cuIcon-' + item.cuIcon,'text-' + item.color]">
			<view class="cu-tag badge" v-if="item.badge!=0">
				<block v-if="item.badge!=1">{{item.badge>99?'99+':item.badge}}</block>
			</view>
		</view>
		<text>{{item.name}}</text>
  	</view>
  </view>
  </view>
</template>

<script>
	import common from 'common/common.js';
export default {
	data(){
		return{
			cuIconList: [
			// {
			// 	cuIcon: 'cardboardfill',
			// 	color: 'red',
			// 	badge: 120,
			// 	name: 'VR'
			// }, 
			{
				cuIcon: 'form',
				color: 'orange',
				badge: 0,
				name: '任务',
				url: `/pages/showList/showList`
			}, {
				cuIcon: 'post',
				color: 'yellow',
				badge: 0,
				name: '每日汇报',
				url: `/pages/report/report`
			},{
				cuIcon: 'rankfill',
				color: 'yellow',
				badge: 0,
				name: '每日汇报汇总',
				url: `/pages/report/reportStatistics`
			},{
				cuIcon: 'ticket',
				color: 'olive',
				badge: 0,
				name: '卡劵',
				url: `/pages/welfareMall/coupons`
			}, {
				cuIcon: 'goods',
				color: 'cyan',
				badge: 0,
				name: '本地生活',
				url: `http://ls.scjnxx.com/?myCode=`
			}, {
				cuIcon: 'apps',
				color: 'blue',
				badge: 0,
				name: '项目',
				url: `/pages/project/project`
			}, {
				cuIcon: 'activity',
				color: 'purple',
				badge: 0,
				name: 'OKRS',
				url: `/pages/okrs/okrList`
			}, {
				cuIcon: 'favor',
				color: 'purple',
				badge: 0,
				name: '资源信息',
				url: `/pages/agent/productResources`
			}, {
				cuIcon: 'favor',
				color: 'purple',
				badge: 0,
				name: '代理信息',
				url: `/pages/agent/agent`
			}, {
				cuIcon: 'send',
				color: 'mauve',
				badge: 0,
				name: '审批',
				url: `/pages/examine/examineIndex`
			}],
			modalName: null,
			gridCol: 5,
			gridBorder: false,
			staff: {},
		}
	},
	onLoad(options) {
		if(!document.URL.split("=")[1]){
			this.staff = uni.getStorageSync("staff");
		} else {
			this.code = document.URL.split("=")[1].split("&")[0];
			this.toApp(this.code);
		}
		// this.staff = uni.getStorageSync("staff");
	},
	methods:{
		// 获取授权
		toApp(code){
			var _this = this;
			uni.request({
				url: common.api_base_url+'/app' ,
				data:{
					"code": code
				},
				header:{
				},
				method: 'GET',
				success: res => {
					_this.staff = res.data;
					uni.setStorageSync('staff', _this.staff);
					_this.getTaskByIdAndTime();
					_this.getDelayTask();
				},
				fail: function(e) {
					uni.showToast({
						title:"唉哟，程序错误了["+JSON.stringify(e)+"]",
						icon:"loading"
					})
				},
			});
			_this.code = '';
		},
		toDetail(item){
			console.log(item)
			if( item.cuIcon == "goods"){
				location.href =item.url + this.staff.id;
				return;
			}
			if( item.cuIcon == "rankfill"){
				if(this.staff.id == "8" || this.staff.id =="10" || this.staff.id =="9" || this.staff.id =="42"){
					uni.navigateTo({
						url: item.url
					})
					return;
				} else{
					uni.showToast({
						title:"权限不足",
						icon:"error"
					})
					return;
				}
			}
			console.log(1)
			uni.navigateTo({
				url: item.url
			})
		},
		showModal(e) {
			console.log(22)
			this.modalName = e.currentTarget.dataset.target
		},
	  hideModal(e) {
		  console.log(11)
	  	this.modalName = null
	  },
	  Gridchange(e) {
		  console.log(44)
	  	this.gridCol = e.detail.value
	  },
	  Gridswitch(e) {
		  console.log(55)
	  	this.gridBorder = e.detail.value
	  },
	}
};
</script>

<style>
/* 样式可以根据实际需求进行定义 */
.container {
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
}
</style>
